// Tabs Button Style
.nav-button {
  nav {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-bottom: 40px;
    padding-bottom: 0px;
    position: relative;
    border-bottom: 1px solid $border-color;
    @media #{$xs}{
      border: 0;
    }

    .nav-tabs {
      border: 0;

      .nav-item {
        display: block;
        @media #{$xs}{
          font-size: 18px;
        }
      }

      .nav-link {
        font-family: $font_1;
        color: $heading-color;
        font-size: 16px;
        font-weight: 500;
        border: 0;
        padding: 36px 12px;
        padding-top: 0;
        border-bottom: 4px solid transparent;
        margin-right: 15px;
        @media #{$xs}{
          border-bottom: 0;
          margin-right: 0;
          padding: 10px 12px;
        }

        &:last-child {
          margin-right: 0;
        }

        &.active {
          color: $theme-color;
          border-bottom: 4px solid $theme-color;
          background: none;
          @media #{$xs}{
            border-bottom: 0;
          }

        }

        &:hover {
          border-bottom: 4px solid $theme-color;
          @media #{$xs}{
            border-bottom: 0;
          }
        }
      }
    }
  }

  .nav-tittle {
    h2 {

      color: $heading-color;
      font-size: 34px;
      font-weight: 500;
      line-height: 1.3;
      margin-bottom: 2px;

      @media #{$sm}{
        font-size: 38px;
        line-height: 1.2;
        margin-bottom: 20px;
      }
      @media #{$xs}{
        font-size: 28px;
        line-height: 1.2;
        margin-bottom: 20px;
      }
    }
  }
}

.latest-items {
  padding-top: 95px;
  padding-bottom: 100px;
  text-align: center;
  @media #{$md}{
    padding-top: 95px;
    padding-bottom: 100px;
  }
  @media #{$sm}{
    padding-top: 70px;
    padding-bottom: 70px;
  }
  @media #{$xs}{
    padding-top: 70px;
    padding-bottom: 70px;
  }

  &.latest-items2 {
    padding: 0;
  }

  &:first-child {
    margin-left: 0;
  }

  &:last-child {
    margin-right: 0;
  }

  .properties {
    margin: 0 12px;

    .properties-card {
      background-color: #fff;

      .properties-img {
        position: relative;
        overflow: hidden;

        img {
          @include transition(.4s);
          width: 100%;
          transform: scale(1)
        }

        .socal_icon {
          @include transition(.2s);
          position: absolute;
          left: 0;
          right: 0;
          margin: 0 auto;
          opacity: 0;
          visibility: hidden;
          bottom: 20px;
          text-align: center;

          a {
            @include transition(.5s);
            background: #fff;
            color: $heading-color;
            width: 64px;
            height: 50px;
            display: inline-block;
            font-size: 24px;
            text-align: center;
            line-height: 54px;
            margin: -3px;

            &:hover {
              background: $theme-color;
              color: #fff;
            }
          }
        }
      }

      .properties-caption {
        padding: 14px 20px 2px 0px;
        @include transition(.4s);

        h3 {
          a {
            color: $heading-color;
            font-size: 16px;
            font-weight: 400;
            margin-bottom: 6px;
          }
        }

        .properties-footer {
          @include transition(.4s);
          @media #{$xs}{
            padding: 19px 10px 20px 12px;
          }

          .price {
            span {
              color: #74706B;
              cursor: pointer;
              font-weight: 500;
              font-size: 16px;

              span {
                display: inline-block;
                color: #CEBD9C;
                text-decoration: line-through;
                margin: 0;
                margin-left: 12px;
              }
            }
          }

        }

      }
    }

    &:hover {
      .properties-caption {
        h3 {
          a {
            color: $theme-color;
          }
        }

        .properties-footer {
          .price {
            span {
              color: $heading-color;
            }
          }
        }
      }

      .properties-img {
        img {
          transform: scale(1.03);
        }

        .socal_icon {
          opacity: 1;
          visibility: visible;
        }
      }
    }
  }
}

// Arrow
.latest-items-active {
  button {
    &.slick-arrow {
      position: absolute;
      border: 0;
      padding: 0;
      z-index: 2;
      cursor: pointer;
      top: 50%;
      transform: translateY(-50%);
      left: auto;
      background: none;

      i {
        font-size: 30px;
        color: rgba(32, 69, 112, .3);
        @include transition(.2s);

        &:hover {
          color: $theme-color;
        }
      }
    }

    &.slick-prev {
      left: -40px;
      @media #{$laptop}{
        left: -20px;
      }
      @media #{$large1}{
        left: -30px;
      }
      @media #{$lg}{
        left: -27px;
      }
      @media #{$md}{
        left: -25px;
      }
      @media #{$sm}{
        left: -10px;
      }
    }

    &.slick-next {
      right: -40px;
      @media #{$laptop}{
        right: -20px;
      }
      @media #{$large1}{
        right: -30px;
      }
      @media #{$lg}{
        right: -27px;
      }
      @media #{$md}{
        right: -20px;
      }
      @media #{$sm}{
        right: -10px;
      }
    }
  }
}
